<!DOCTYPE html>

<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" href="/css/newStyle.css" th:href="@{/css/newStyle.css}">
<link href="../junior/css/bootstrap.css" rel="stylesheet" />
<link href="../junior/css/Multiselect/style.css" rel="stylesheet" />
<script src="../junior/js/jquery-3.2.1.min.js"></script>
<script src="../junior/js/bootstrap.js"></script>
<script src="../junior/js/multiselect.min.js"></script>
<script>
	jQuery(document).ready(function($) {
		$('.js-multiselect').multiselect({
			right : '#js_multiselect_to_1',
			rightAll : '#js_right_All_1',
			rightSelected : '#js_right_Selected_1',
			leftSelected : '#js_left_Selected_1',
			leftAll : '#js_left_All_1'
			,afterMoveToRight:function($left, $right, $options){//	元素向右移动后事件
				 var isUpdate = $options.attr("data-isUpdate")=='true'?'false':'true';
				$( $options).attr("data-isUpdate", isUpdate);
			}
			,afterMoveToLeft:function($left, $right, $options){//	元素向左移动后事件
				 var isUpdate = $options.attr("data-isUpdate")=='true'?'false':'true';
					$( $options).attr("data-isUpdate", isUpdate);
			}
		});
	});
</script>
</head>
<body>
<!-- 返回上一级提交表单 -->
<form id="returnBack" action="check" method="post">
	<input type="hidden" th:value="${junior.byzxdm}" name="byzxdm" />
	<input type="hidden" th:value="${junior.byzxmc}" name="byzxmc" />
	<input type="hidden" th:value="${junior.password}" name="password" />
</form>
<div class="mainBox">
		<div class="mainBox_inner">
	<h1>凉山州中考信息管理系统(初中毕业学校)</h1>
	
<!-- 	<form id="form1"> -->
<!-- 		<div class="container"> -->
<!-- 			<div class="clearfix" style="margin-bottom: 20px;"></div> -->
			
<!-- 			<div class="row" style="text-align:right;margin-bottom:20px;"> -->
<!-- 				<div class="col-xs-6 col-md-6 text-left"><span th:text="${junior.byzxmc}+' 学生转入转出'"></span></div> -->
<!-- 				<div class="col-xs-6 col-md-6 text-right">	<a href="JavaScript:void(0);" onclick="$('#returnBack').submit();">返回上级</a> -->
<!-- 					<a href="logout">安全退出</a></div> -->
<!-- 			</div> -->
<!-- 			<div class="row"> -->
<!-- 						<hr style=" height:2px;border:none;border-top:2px solid #185598;" /> -->
<!-- 						</div> -->
	
<!-- 			<div class="row"> -->
<!-- 				<div class="col-xs-5" th:object="${studentLefts}"> -->
<!-- 					<div class="row text-center"> -->
<!-- 						<span></span> -->
<!-- 					</div> -->
<!-- 					<div class="row"> -->
<!-- 						<div class="input-group"> -->
<!-- 							<span class="input-group-addon" -->
<!-- 								style="color: rgb(0, 91, 171); font-size: 14px">本地学生</span> <input -->
<!-- 								type="text" class="form-control" placeholder="姓名或身份证号部分字符" id="sfzh_bd"/> -->

<!-- 						</div> -->
<!-- 						<div class="clearfix" style="margin-bottom: 10px;"></div> -->
<!-- 						<button type="button" class="btn center-block" id="search1" -->
<!-- 							name="search1">查询</button> -->
<!-- 					</div> -->
<!-- 					<div class="clearfix" style="margin-bottom: 10px;"></div> -->
<!-- 					<div class="row"> -->
<!-- 						<select name="from" class="js-multiselect form-control" size="8" -->
<!-- 							multiple="multiple" id="left"> -->

<!-- 							<option th:if="${studentLefts!=null}" -->
<!-- 								th:each="studentLeft:${studentLefts}" -->
<!-- 								th:value="${studentLeft.sfzh}" -->
<!-- 								th:text="${studentLeft.xm} + '  ' + ${studentLeft.sfzh}" -->
<!-- 								th:attr="data-isUpdate=false">Item -->
<!-- 								1</option> -->

<!-- 						</select> -->
<!-- 					</div> -->
<!-- 				</div> -->

<!-- 				<div class="col-xs-2"> -->
<!-- 					<div class="clearfix" style="margin-bottom: 90px;"></div> -->
<!-- 					<div class="row"> -->
<!-- 						<button type="button" id="js_right_All_1"
<!-- 							class="btn btn-block center-block" hidden="hidden"> -->
<!-- 							<i class="glyphicon glyphicon-forward"></i> -->
<!-- 						</button> --> -->
<!-- 						<button type="button" id="js_right_Selected_1" -->
<!-- 							class="btn btn-block"> -->
<!-- 							<i class="glyphicon glyphicon-chevron-right"></i> -->
<!-- 						</button> -->
<!-- 						<button type="button" id="js_left_Selected_1" -->
<!-- 							class="btn btn-block"> -->
<!-- 							<i class="glyphicon glyphicon-chevron-left"></i> -->
<!-- 						</button> -->
<!-- 						<button type="button" id="js_left_All_1" class="btn btn-block" hidden="hidden">
<!-- 							<i class="glyphicon glyphicon-backward"></i> -->
<!-- 						</button> --> -->
<!-- 					</div> -->
<!-- 				</div> -->

<!-- 				<div class="col-xs-5" th:object="${studentRight}"> -->
<!-- 					<div class="row text-center"> -->
<!-- 						<span></span> -->
<!-- 					</div> -->
<!-- 					<div class="row"> -->
<!-- 						<div class="input-group"> -->
<!-- 							<span class="input-group-addon" -->
<!-- 								style="color:  rgb(0, 91, 171); font-size: 14px">待定学生</span> <input -->
<!-- 								type="text" class="form-control" placeholder="姓名或身份证号部分字符" -->
<!-- 								id="sfzh_dd" /> -->

<!-- 						</div> -->
<!-- 					</div> -->
<!-- 					<div class="clearfix" style="margin-bottom: 10px;"></div> -->
<!-- 					<button type="button" class="btn center-block" id="search2" -->
<!-- 						name="search2">查询</button> -->
<!-- 					<div class="clearfix" style="margin-bottom: 10px;"></div> -->
<!-- 					<select name="to" id="js_multiselect_to_1" class="form-control" -->
<!-- 						size="8" multiple="multiple"> -->
<!-- 						<option th:if="${studentRights!=null}"
<!-- 							th:each="studentRight:${studentRights}" -->
<!-- 							th:value="${studentRight.sfzh}" -->
<!-- 							th:text="${studentRight.xm} +'  '+  ${studentRight.sfzh}" -->
<!-- 							th:attr="data-isUpdate=false">Item -->
<!-- 							A</option> --> -->
<!-- 					</select> -->
<!-- 				</div> -->
<!-- 			</div> -->
<!-- 			<div class="row"> -->
<!-- <!-- 				<button type="button" id="updateDclzt" class="btn btn-primary btn-block" >提交</button> --> -->
<!-- 			</div> -->
<!-- 		</div> -->
<!-- 	</form> -->
</div></div>
</body>
<script th:inline="javascript">
    var junior = [[${junior}]];

    //	返回上一级
    function retunBack(){
    	$.ajax({
    		url:"check",
    		method:'post',
    		data:{
	    			'byzxdm':junior.byzxdm
	    			,'byzxmc':junior.byzxmc
	    			,'password':junior.password
    			},
    		 dataType: 'xml',
    		success:function(data){
    			alert(data);
    		},error:function(){
    			alert("error...");
    		 }
    	});

    }
</script>

<script>
	//获取后台数据
	$("#search1").click(
			function() {
				var sfzh = $("#sfzh_bd").val();
				$.ajax({
					method : 'post',
					data : {
						"sfzh" : sfzh
					},
					url : 'doSelectSignUpStudentLeft',
					success : function(result) {
						console.log(result);
						if (result != null && result != undefined) {
							var str = "";
							for (var i = 0; i < result.length; i++) {
								str += "<option data-isupdate='false' value="+result[i].sfzh+">"
										+ result[i].xm + "  " + result[i].sfzh +"</option>"
							}
							$("#left").html(str);
						}
					},
					error : function() {
						alert("未找到符合条件学生!")
					}
				})
			});
	
	//获取右边待定学生数据
	$("#search2").click(
		function() {
			var sfzh = $("#sfzh_dd").val();
			$.ajax({
				method : 'post',
				data : {
					"sfzh" : sfzh
				},
				url : 'doSelectSignUpStudentRight',
				success : function(result) {
					if (result != null && result != undefined) {
						var str = "";
						for (var i = 0; i < result.length; i++) {
							str += "<option data-isupdate='false' value="+result[i].sfzh+">"
									+ result[i].xm + "  " + result[i].sfzh +"</option>"
						}
						$("#js_multiselect_to_1").html(str);
					}
				},
				error : function() {
					alert("未找到符合条件学生!")
				}
			})
		});
	
	//保存更新
	$("#updateDclzt").click(
	function (){
		var updateData = new Array();
		
		//	获取左侧改变的值
		var leftChange = $("#left option[data-isupdate='true']");
		for(var i = 0;i<leftChange.length;i++){
			var leftObject = new Object();
			leftObject.sfzh = $(leftChange[i]).val();
			leftObject.dclzt = 1;
			updateData.push(leftObject);
		}
		
		//	获取右侧改变的值
		var rightChange = $("#js_multiselect_to_1 option[data-isupdate='true']");
		for(var i = 0;i<rightChange.length;i++){
			var rightObject = new Object();
			rightObject.sfzh = $(rightChange[i]).val();
			rightObject.dclzt = 2;
			updateData.push(rightObject);
		}
		
	         /* var prirelRightId = document.getElementById("js_multiselect_to_1");
	         var prirelRightValues = new Array();
	         for (var i = 0; i < prirelRightId.options.length; i++) {
	             prirelRightValues[i] = "sfzh"+prirelRightId.options[i].value;
	         }
	         var students = JSON.stringify(prirelRightValues);
	         console.log(students); */
	         if(updateData.length<=0){
	        	 alert("未修改数据！");return;
	         }
	         $.ajax({
	             type:"post",
	             data:JSON.stringify(updateData),
	             dataType:"text",
	             contentType: "application/json; charset=utf-8",
	             url:'doUpdateDclzt',
	             success:function(data){
	            	 	alert(data)
		          },
		             error : function() {
							alert("服务器错误!")
						}
	         })
	    });
</script>
</html>
